<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description"content="{{site.description}}">
    <meta name="keywords" content="{{site.keywords}}"/>
    <meta property="og:title" content="{{site.title}}" />
    <meta property="og:description" content="{{site.description}}" />
    <title>{{site.title}}-{{site.name}}</title>
    {{include './common/css.html'}}
</head>
<body class="font-sans bg-gray-50">
    {{include './common/header.html'}}

    <!-- 新闻列表内容 -->
    <main class="pt-16 pb-12">
        <div class="container mx-auto px-4">
            <h1 class="text-3xl font-bold text-center my-8">新闻动态</h1>
            
            <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
                <!-- 新闻条目1 -->
                 {{if articleList.list.length>0}}
                 {{each articleList.list}}
                <article class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow">
                    <img src="{{$value.img}}" alt="新闻图片" class="w-full h-48 object-cover">
                    <div class="p-6">
                        <time class="text-gray-500 text-sm">{{dateFormat($value.createdAt, 'YYYY-MM-DD')}}</time>
                        <h2 class="text-xl font-semibold my-2">
                            <a href="{{$value.path}}/article-{{$value.id}}.html" class="hover:text-blue-600">{{$value.title}}</a>
                        </h2>
                        <p class="text-gray-600 mb-4">{{$value.description}}</p>
                        <a href="{{$value.path}}/article-{{$value.id}}.html" class="text-blue-600 font-medium">阅读更多 <i class="fas fa-arrow-right ml-1"></i></a>
                    </div>
                </article>
                {{/each}}
                {{/if}}
            </div>

            <!-- 分页 -->
             {{if pageHtml}}
            <div class="flex justify-center mt-12">
                <nav class="flex items-center space-x-2">
                     {{@ pageHtml}}
                    <!-- <a href="#" class="px-4 py-2 border border-gray-300 rounded-md hover:bg-gray-50">上一页</a>
                    <a href="#" class="px-4 py-2 bg-blue-600 text-white rounded-md font-medium">1</a>
                    <a href="#" class="px-4 py-2 border border-gray-300 rounded-md hover:bg-gray-50">2</a>
                    <a href="#" class="px-4 py-2 border border-gray-300 rounded-md hover:bg-gray-50">3</a>
                    <a href="#" class="px-4 py-2 border border-gray-300 rounded-md hover:bg-gray-50">下一页</a> -->
                </nav>
            </div>
             {{/if}}
        </div>
    </main>

    <!-- 页脚 -->
   {{include './common/footer.html'}}
   {{include './common/js-common.html'}}
</body>
</html>